<template>
    <div>
        <el-form-item label="节点图标">
            <el-select filterable allow-create v-model="data.options.iconDefaultValue" @change="changeValue($event,'icon')">
                <el-option v-for="(item, dictIndex) in selectDict" :key="dictIndex" :value="item.code" :label="item.name"/>
            </el-select>
        </el-form-item>
        <el-form-item label="节点头像">
            <el-select filterable allow-create v-model="data.options.avtarDefaultValue" @change="changeValue($event,'avtar')">
                <el-option v-for="(item, dictIndex) in selectDict" :key="dictIndex" :value="item.code" :label="item.name"/>
            </el-select>
        </el-form-item>
        <el-form-item label="节点标题">
            <el-select filterable allow-create v-model="data.options.titleDefaultValue" @change="changeValue($event,'title')">
                <el-option v-for="(item, dictIndex) in selectDict" :key="dictIndex" :value="item.code" :label="item.name"/>
            </el-select>
        </el-form-item>
        <el-form-item label="节点内容">
            <el-select filterable allow-create v-model="data.options.contentDefaultValue" @change="changeValue($event,'content')">
                <el-option v-for="(item, dictIndex) in selectDict" :key="dictIndex" :value="item.code" :label="item.name"/>
            </el-select>
        </el-form-item>
    </div>
</template>
<script>
export default {
    name: 'BaseTimeLine',
    props: {
        data: {
            type: Object
        },
        selectDict: {
            type: Array
        }
    },
    methods: {
        changeValue(e, type) {
            let obj = {}
            obj = this.selectDict.find((item) => {
                return item.code === e
            })
            if (obj) {
                this.data.options[type+'DefaultValue'] = obj.code
                this.data.options[type+'DefaultCName'] = obj.name
            } else {[type+'DefaultCName']
                this.data.options[type+'DefaultCName'] = this.data.options[type+'DefaultValue']
            }
        }
    }
}
</script>
